{namespace dce=ArminVieweg\Dce\ViewHelpers}
<f:layout name="Default"/>

<f:section name="main">
    <div class="c-content-box c-size-md c-bg-parallax" style="background-image: url(fileadmin/templates/v2/public/images/bg-parallax.jpg)">
        <div class="container">
            <div class="c-content-counter-1">
                <div class="c-content-title-1">
                    <h3 class="c-center c-font-uppercase c-font-white c-font-bold">{field.title}</h3>

                    <div class="c-line-center c-bg-white"></div>
                </div>
                <div class="row c-margin-t-60">
                    <f:for each="{field.data}" as="vo" iteration="itemIteration">
                        <f:if condition="{itemIteration.index} < 3">
                            <div class="col-md-4">
                                <f:switch expression="{itemIteration.index}">
                                    <f:case value="1">
                                        <div class="c-counter c-font-white c-bordered c-border-blue c-font-white" data-counter="counterup">{vo.number}</div>
                                    </f:case>
                                    <f:case value="2">
                                        <div class="c-counter c-font-white c-bordered c-border-green c-font-white" data-counter="counterup">{vo.number}</div>
                                    </f:case>
                                    <f:case default="1">
                                        <div class="c-counter c-font-white c-bordered c-border-red c-font-white" data-counter="counterup">{vo.number}</div>
                                    </f:case>
                                </f:switch>
                                <h4 class="c-title c-first c-font-white c-font-uppercase c-font-bold">{vo.name}</h4>
                                <p class="c-content c-font-white c-opacity-08">{vo.description}</p>
                            </div>
                        </f:if>
                    </f:for>
                </div>
            </div>
        </div>
    </div>
</f:section>